<template>
	<div>
		<el-breadcrumb separator-class="el-icon-arrow-right">
		  	<el-breadcrumb-item :to="{ path: '/order' }">首页</el-breadcrumb-item>
		  	<el-breadcrumb-item>订单详情</el-breadcrumb-item>
		</el-breadcrumb>
		
		 <el-table
		    :data="goods"
		    height="250"
		    border
		    style="width: 100%">
		  
		   <el-table-column
		      type="index"
		      width="50">
		    </el-table-column>
		  
		    <el-table-column
		      prop="username"
		      label="客户"
		      width="120">
		    </el-table-column>
		    
		    <el-table-column
		      prop="customer_sn"
		      label="客户代码"
		      width="120">
		    </el-table-column>
		    
		    <el-table-column
		      prop="title"
		      label="商品名称"
		      width="140">
		    </el-table-column>
		    
		    <el-table-column
		      prop="sub_order_sn"
		      label="订单号"
		      width="200">
		    </el-table-column>
		    
		    <el-table-column
		      prop="odcreate_time"
		      label="下单时间"
		      width="160">
		    </el-table-column>
		    
		    <el-table-column
		      prop="odnum"
		      label="数量"
		      width="50">
		    </el-table-column>
		    
		    <el-table-column
		      prop="odprice"
		      label="价格"
		      width="120">
		    </el-table-column>
		    
		    <el-table-column
		      prop="order_status"
		      label="状态"
		      width="100" :formatter="formatStatus">
		    </el-table-column>
		    
		    
		   
		  </el-table>
		  
	</div>
</template>

<script type="text/javascript">
	import E from 'wangeditor'
	import 'wangeditor/release/wangEditor.min.css'
	export default{
		data(){
			return{
				max:20,
				goods:{
					id:"",
					title:"",
					status:true,
					detailText:"",
					detailPic:[],
					price:0,
					stock:0,
					
				},
				cateList:[],
				dialogVisible:false,
				goods:[],
				phoneEditor:null
			}
		},
		mounted () {
	      	this.phoneEditor = new E('#websiteEditorElem')
	      	this.phoneEditor.onchange = function () {
	        	this.goods.detailText = this.$txt.html()
	      	}
	      	this.phoneEditor.create()
	    },
		created(){
			this.goods._token = window.axios.defaults.headers.common['X-CSRF-TOKEN'];
			//this.getCates();
			this.getGood();
		},
		methods:{
			getGood(){
				axios.get('/api/order/detail/'+this.$route.params.order_sn)
					.then(res => {
						var data = res.data.result;
						this.goods = data;
					//	this.attrs = data.attrs;
						
						
					})
					.catch(error => {

					})
				
			},
			getCates()
			{
				axios.get('/api/cates')
					.then(result => {
						this.cateList = result.data.result;
					})
			},
			formatStatus: function (row, column) {
				return row.order_status == 1 ? '已发货' : row.order_status == 2 ? '已完成' : '待发货';
			},
			handleAttrData(data){
				var temp = [];
				for(var i=0;i<data.length;i++){
					temp.push({label:data[i].attr_name, key:'{"attr_id":'+data[i].id+',"cate_id":'+data[i].cate_id+'}'});
				}
				return temp
			},
			handleRemove(file, fileList) {
		        console.log(file, fileList);
		    },
		    handlePreview(file) {
		        console.log(this.goods.detailPic);
		   	},
		    handlePictureCardPreview(file){
		        this.dialogImageUrl = file.url;
		        this.dialogVisible = true;
		    },
		    handleExceed(files, fileList) {
	        	this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
	      	},
		    beforeRemove(file, fileList) {
		        return this.$confirm(`确定移除 ${ file.name }？`);
		    },
		    successEvent(file){
		    	this.goods.headPic.push(file.result);
		    	this.goods.detailPic.push({name:file.result,url:file.result});
		    },
		    handleClose(obj){
		    	console.log(obj);
		    },
		    filterMethod(query,item){
		    	return item;
		    }
		}
	}
</script>

<style type="text/css">
	input[type=file] {
	    display: none;
	}
</style>